<template>
  <view>
    <!-- 公共组件-每个页面必须引入 -->
    <public-module></public-module>
    <view class="account-form-box">
      <u--form labelPosition="left" labelWidth="80">
        <coinselect @eventChange="coinChange" :exclude_id="0" :default_id="default_id"></coinselect>
        <u-form-item label="可用余额">{{coin_info.balance_available}} {{coin_info.unit}}</u-form-item>
		<u-form-item label="手续费">{{(tibi_shouxufei*100)}} %</u-form-item>
        <u-form-item label="提现数额" prop="nums">
          <u-input v-model="nums"
            placeholder="请填写提现数额"
            type="text"
            @input="jsrealnums()"/>
        </u-form-item>
        <!--u-form-item class="form-item" label="系统手续费"  :label-position="form.labelPosition" :label-width="form.labelwidth">
          <u-input  placeholder="" :value="coin_info.tibi_sys_shouxufei * 10 + '%'" :disabled="true" type="text"/>
          <text slot="right" style="font-size: 22rpx">{{
            coin_info.tibi_msg
          }}</text>
        </u-form-item-->

		
        <!-- <u-form-item class="form-item"
          label="Fullname"
          :label-position="form.labelPosition"
          :label-width="form.labelwidth">
          <u-input v-model="user.userInfo.realname" placeholder="实名认证后显示名字" type="text" :disabled="true"/>
        </u-form-item>
		
				<view class="u-p-t-10">
					<u-row gutter="0" justify="space-between">
						<u-col span="2"><view>微信</view></u-col>
						<u-col span="8"><view v-if="user.userInfo.wechatID!=''">{{user.userInfo.wechatID}}</view><view v-else>未设置</view></u-col>
						<u-col span="2"><u-switch v-model="is_wx" size="30"></u-switch></u-col>
						</u-col>
					</u-row>
				</view>
				<view class="u-p-t-10">
					<u-row gutter="0" justify="space-between">
						<u-col span="2"><view>支付宝</view></u-col>
						<u-col span="8"><view v-if="user.userInfo.alipayID!=''">{{user.userInfo.alipayID}}</view><view v-else>未设置</view></u-col>
						<u-col span="2"><u-switch v-model="is_al"  size="30"></u-switch></u-col>
						</u-col>
					</u-row>
				</view>
				<view class="u-p-t-10"> 
					<u-row gutter="0" justify="space-between">
						<u-col span="2"><view v-if="user.userInfo.bankAccount!=''">{{user.userInfo.bankName}}</view><view v-else>收款银行</view></u-col>
						<u-col span="8"><view v-if="user.userInfo.bankAccount!=''">{{user.userInfo.bankAccount}}</view><view v-else>未设置</view></u-col>
						<u-col span="2"><u-switch v-model="is_bnk"  size="30"></u-switch></u-col>
						</u-col>
					</u-row>
				</view> -->
        <u-form-item label="实际到帐">
          <u--input
            v-model="realnums"
            placeholder=""
            type="text"
            :disabled="true"/>
        </u-form-item>
      </u--form>

      <u-gap height="20"></u-gap>

      <u-button type="primary" @click="submit">确认</u-button>
    </view>

    <u-gap height="20"></u-gap>
  </view>
</template>

<script>
import { mapState, mapMutations } from "vuex";
import coinselect from "@/pagesPackageA/components/coinselect.vue";
import { api_assets_list } from '@/config/api.js';
export default {
  components: {
    coinselect,
  },
  data() {
    return {
      loadstatus: false,
      loadstxt: "loadstxt",
      default_id: '',
      form: {
        errorType: ["message"],
        labelPosition: "top",
        labelwidth: "210",
      },
      coin_info: {
        balance_available: "",
        unit: "",
        tibi_shouxufei: "",
        wallet: [],
      },
      tibi_shouxufei: "",
      coinid: "",
      nums: "",
      realnums: "0",
      walletaddress: "",
      rules: {
        nums: [
          {
            // 自定义验证函数，见上说明
            validator: (rule, value, callback) => {
              if (this.nums == "") {
                callback(new Error("Please fill in the quantity"));
              } else {
                if (this.nums <= this.coin_info.balance_available) {
                  callback();
                } else {
                  callback(new Error("Insufficient available balance"));
                }
              }
            },
            // 触发器可以同时用blur和change
            trigger: ["change", "blur"],
          },
        ],
        walletaddress: [
          {
            required: true,
            message: "请填写收款地址",
            trigger: ["change", "blur"],
          },
        ],
      },
      radiovalue: "",
	  bankname:'',
      is_wx: true,
      is_al: true,
      is_bnk: true,
    };
  },
  computed: {
    ...mapState(["userInfo"]),
  },
  onLoad(option) {
    this.default_id = option.selectcoinid;
    //if (this.user.userInfo.wechatID == "" || this.user.userInfo.wechatID == null) this.is_wx = false;
    //if (this.user.userInfo.alipayID == "" || this.user.userInfo.alipayID == null) this.is_al = false;
    //if (this.user.userInfo.bankAccount == "" || this.user.userInfo.bankAccount == null) this.is_bnk = false;
    //uni.setNavigationBarTitle({title: this.$t('assets.withdrawal')});
  },
  methods: {
    jsrealnums() {
      if (this.nums > this.coin_info.balance_available) {
        this.realnums = 0;
      } else {
        this.realnums = (
          this.nums -  this.nums*this.tibi_shouxufei 
          //-this.nums * this.coin_info.tibi_sys_shouxufei
        ).toFixed(4);
      }
    },
    radioGroupChange(e) {
      console.log(e);
      for (let i = 0; i < this.coin_info.wallet.length; i++) {
        if (this.coin_info.wallet[i].type == e) {
          this.tibi_shouxufei = (this.coin_info.wallet[i].tibi_shouxufei*1).toFixed(2);
        }
      }
    },
    coinChange(data) {
		console.log(data)
      this.coinid = data.value;
      api_assets_list({
        coinid: data.value,
      }).then((res) => {
            this.coin_info = res.currentcoininfo;
            this.tibi_shouxufei = (this.coin_info.tibi_shouxufei*1).toFixed(2);
          
        }).catch((e) => {});
    },
    submit() {

		  if (this.userInfo.is_realname==0){
			  //this.$tools.msg("请先实名认证");return;
		  }
		  // if(this.user.userInfo.wechatID == null && this.user.userInfo.alipayID == null && this.user.userInfo.bankAccount==null){
			 //  this.$tools.msg("请先完善支付帐号");return;
		  // }
		  // if(this.is_wx== false && this.is_al == false && this.is_bnk==false){
			 //  this.$tools.msg("请至少选择一个提现方式");return;
		  // }
		  // if (this.is_wx==true && this.user.userInfo.wechatID == null){
			 //  this.$tools.msg("您选择提现到微信，但微信未完善");return;
		  // }
		  // if (this.is_al==true && this.user.userInfo.alipayID == null){
			 //  this.$tools.msg("您选择提现到支付宝，但支付宝未完善");return;
		  // }
		  // if (this.is_bnk==true && this.user.userInfo.bankAccount == null){
			 //  this.$tools.msg("您选择提现到银行，但银行未完善");return;
		  // }

          this.loadstatus = true;
          this.loadstxt = "loading";
          return new Promise((resolve, reject) => {
            this.$api("assets.ti_bi", {
              coinid: this.coinid,
              //wallettype: '',
              nums: this.nums,
			  is_wx: this.is_wx,
			  is_al: this.is_al,
			  is_bnk: this.is_bnk,
              walletaddress: this.bankname+' '+this.walletaddress+' '+this.userInfo.realname,
            }).then((res) => {
                this.loadstatus = false;
                console.log("edit", res);
                if (res.code == 200) {
					this.$Router.push({path:"/pages/componentsA/my/success",query:{title: 'Withdrawal succeeded',msg:res.msg}});
                } else {
                  this.$u.toast(res.msg);
                }
              }).catch((e) => {
                this.loadstatus = false;
                resolve(false);
              });
          });

    },
  },

};
</script>

<style lang="scss" scoped>
.account-form-box {
  padding: 0 32rpx;
}
</style>
